var TableTpl = require("./table.html");

import "./table.css";

module.exports = function($el, id,  data, cbk){
    var checkedLi = [];
    data.tableId = id;
    data.formatObj = function(func, tb, index){
        var dataTmp = func;
        dataTmp.tableIndex = index;
        dataTmp.obj = tb;
        return JSON.stringify(dataTmp);
    };
    data.filterFunc = function(filterObj,tb){
        if(filterObj.funcList && filterObj.handler){
            return filterObj.handler(filterObj.funcList,tb);
        }else{
            return filterObj.funcList;
        }
    };
    $el.empty();
    $el.append(TableTpl(data));
    $('#' + id + ' tbody tr:odd').addClass('ts-table-odd');
    $el.addClass('ts-table-ctt-parent');
    data.tHeader.map((item,index) => {
        if(!item.width){
            var $th = $el.find('th').eq(index);
            var offsetWidth = $th[0].offsetWidth;

            $th.css({
                width: offsetWidth
            });
        }
    });
    (data.data || []).map((item, index)=>{
        if(data.special) {
            const special = data.special, curList = data.data[index], 
                  $tr = $el.find('tr').eq(index + 1);
            special.map((spe)=>{
                const val = spe.dis(curList[spe.key]);
                if(val == spe.val) {
                    $tr.addClass(spe.cls);
                }
            })
        }
    })
    if(cbk){
        cbk();
    }
    function getTop(target) {
        var offset = target.offset(), top = offset.top - (document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop);
        $(".ts-css1").css({
            top: `${top}px`
        })
    }
    $('.ts-table-ops').hover(function(e){
        var $target = $(this);
        var offset = $target.offset();
        var width = $target.width();
        var ulWidth = $target.find('ul').width();
        var top = offset.top - (document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop);
        var css1 = '<div id="ood1" style="display: none;"><style>ul.ts-css1{display:block;min-width: ' + width + 'px;top: ' + top + 'px ; left: ' + (offset.left + width / 2) + 'px !important;margin-left: -' + (ulWidth / 2 ) +'px}</style></div>';

        $target.find('ul').addClass('ts-css1');
        $target.append(css1);

        $(window).on('scroll', getTop.bind(this, $target))
    }, function(e){
        var $target = $(e.target);
        if(!$target.is('ul')){
            $target = $target.parents('ul');
        }
        $target.removeClass('ts-css1').removeAttr('style');
        $('#ood1').remove();
        $(window).off('scroll', getTop)
        //$target.css({position: 'fixed', top: offset.top + 'px', left: offset.left + 'px'});
    });
    $('#'+id+' .ts-table-operate').bind('click', function(e){
        var $target = $(e.target);
        if(!$target.is('.ts-table-operate')){
            $target = $target.parents('.ts-table-operate');
        }
        data.opFunction($target.data('objs'),$target.parents('tr'));
    });
    $('#'+id+' .ts-table-htt').bind('click', function(e){
        var $target = $(e.target);
        if(!$target.is('.ts-table-htt')){
            $target = $target.parents('.ts-table-htt');
        }
        data.opFunction($target.data('objs'),$target.parents('tr'));
    });

    //全选反选逻辑
    $('.checkAll').on('click',function(e){
        checkedLi = [];
        var childs = $('.childCheck');
        if(this.checked){
            this.checked = true;
            for(var i = 0; i < childs.length; i++){
                childs[i].checked = true;
            }
        }else{
            this.checked = false
            for(var i = 0; i < childs.length; i++){
                childs[i].checked = false;
            }
        }
        var checkedNum = $('.childCheck:checked');
        for(var i = 0; i < checkedNum.length; i ++){
            checkedLi.push(checkedNum[i].value);
        }
        $('#'+id)
    });
    $('.childCheck').on('click',function(){
        checkedLi = [];
        var childs = $('.childCheck');
        var checkedNum = $('.childCheck:checked');
        if(checkedNum.length == childs.length){
            $('.checkAll')[0].checked = true;
        }else{
            $('.checkAll')[0].checked = false;
        }
        for(var i = 0; i < checkedNum.length; i ++){
            checkedLi.push(checkedNum[i].value);
        }
    });
    function returnCheckList(){
        return checkedLi;
    }

    return returnCheckList;
};